<!-- **i18n版本-->
<template>
  <div class="app-container">
    <!--工具栏-->
    <div class="head-container">
      <el-form v-if="crud.props.searchToggle" size="small" label-width="120px">
        <!-- 搜索 -->
        <el-row :gutter="10">
          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6">
            <!--应用ID-->
            <el-form-item :label="tf('appId')">
              <el-input v-model="query.appId" clearable :placeholder="tf('appId')" class="filter-item" @keyup.enter.native="crud.toQuery" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6">
            <!--编码-->
            <el-form-item :label="tf('charset')">
              <Dictionary v-model="query.charset" :updata-dict="query.charset" :dict-key="'charset'" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6">
            <!--类型 -->
            <el-form-item :label="tf('format')">
              <Dictionary v-model="query.format" :updata-dict="query.format" :dict-key="'responseType'" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6">
            <!--网关地址-->
            <el-form-item :label="tf('gatewayUrl')">
              <el-input v-model="query.gatewayUrl" clearable :placeholder="tf('gatewayUrl')" class="filter-item" @keyup.enter.native="crud.toQuery" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6">
            <!--异步回调-->
            <el-form-item :label="tf('notifyUrl')">
              <el-input v-model="query.notifyUrl" clearable :placeholder="tf('notifyUrl')" class="filter-item" @keyup.enter.native="crud.toQuery" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6" />
          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6">
            <el-form-item label="" label-width="28px">
              <rrOperation :crud="crud" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <!--more-button ,slot = 'left' or 'right'-->
      <crudOperation :permission="permission" />

      <!--表单组件-->
      <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="75%">
        <el-form ref="form" :model="form" :rules="rules" size="small" label-width="120px">
          <el-row :gutter="10">
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--应用ID" -->
              <el-form-item :label="tf('appId')" prop="appId">
                <el-input v-model="form.appId" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--编码" -->
              <el-form-item :label="tf('charset')" prop="charset">
                <Dictionary v-model="form.charset" :updata-dict="form.charset" :dict-key="'charset'" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--类型 " -->
              <el-form-item :label="tf('format')" prop="format">
                <Dictionary v-model="form.format" :updata-dict="form.format" :dict-key="'responseType'" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--网关地址" -->
              <el-form-item :label="tf('gatewayUrl')" prop="gatewayUrl">
                <el-input v-model="form.gatewayUrl" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--异步回调" -->
              <el-form-item :label="tf('notifyUrl')" prop="notifyUrl">
                <el-input v-model="form.notifyUrl" :rows="3" type="textarea" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--私钥" -->
              <el-form-item :label="tf('privateKey')" prop="privateKey">
                <el-input v-model="form.privateKey" :rows="3" type="textarea" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--公钥" -->
              <el-form-item :label="tf('publicKey')" prop="publicKey">
                <el-input v-model="form.publicKey" :rows="3" type="textarea" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--回调地址" -->
              <el-form-item :label="tf('returnUrl')" prop="returnUrl">
                <el-input v-model="form.returnUrl" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--签名方式" -->
              <el-form-item :label="tf('signType')" prop="signType">
                <el-input v-model="form.signType" />
              </el-form-item>
            </el-col>
            <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
              <!--商户号" -->
              <el-form-item :label="tf('sysServiceProviderId')" prop="sysServiceProviderId">
                <el-input v-model="form.sysServiceProviderId" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="text" @click="crud.cancelCU">{{ $t('btn.cancel') }}</el-button>
          <el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">{{ $t('btn.confirm') }}</el-button>
        </div>
      </el-dialog>

      <!--表格渲染-->
      <el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%" @selection-change="crud.selectionChangeHandler">
        <el-table-column type="selection" width="55" />
        <el-table-column prop="appId" :label="tf('appId')" />
        <el-table-column prop="charsetCn" :label="tf('charset')" />
        <el-table-column prop="formatCn" :label="tf('format')" />
        <el-table-column prop="gatewayUrl" :label="tf('gatewayUrl')" />
        <el-table-column prop="notifyUrl" :label="tf('notifyUrl')" />
        <el-table-column prop="privateKey" :label="tf('privateKey')" />
        <el-table-column prop="publicKey" :label="tf('publicKey')" />
        <el-table-column prop="returnUrl" :label="tf('returnUrl')" />
        <el-table-column prop="signType" :label="tf('signType')" />
        <el-table-column prop="sysServiceProviderId" :label="tf('sysServiceProviderId')" />
        <el-table-column prop="updateBy" :label="tf('updateBy')" />
        <el-table-column prop="updateTime" :label="tf('updateTime')" />
        <!-- v-if="checkPer(['admin','alipayConfig:edit','alipayConfig:del'])"-->
        <el-table-column :label="$t('btn.operationCol')" width="200px" align="center">
          <template slot-scope="scope">
            <udOperation :data="scope.row" :permission="permission" />
          </template>
        </el-table-column>
      </el-table>
      <!--分页组件-->
      <pagination />

      <preview ref="previewForm" :module="i18nQry.module" />
    </div>
  </div>
</template>

<script>
import crudAlipayConfig from '@/api/alipayConfig'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import preview from './component/detail'
import Dictionary from '@/components/Dictionary/index'
import i18nHandler from '@/mixins/i18nHandler'
import i18n from '@/lang'

const defaultForm = { id: null, appId: null, charset: null, format: null, gatewayUrl: null, notifyUrl: null, privateKey: null, publicKey: null, returnUrl: null, signType: null, sysServiceProviderId: null, createBy: null, createTime: null, updateBy: null, updateTime: null, version: null }

/** ui国际化初始化参数,菜单模块 menu_code**/
const i18nQry = { module: 'AlipayConfig', refer: 't_alipay_config' }

export default {
  name: 'AlipayConfig',
  components: { Dictionary, pagination, crudOperation, rrOperation, udOperation, preview },
  mixins: [presenter(), header(), form(defaultForm), crud(), i18nHandler],

  cruds() {
    return CRUD({ title: i18n.t('AlipayConfig.moduleName'), url: 'business/alipayConfig/pageList', idField: 'id', sort: 'id', order: 'DESC', crudMethod: { ...crudAlipayConfig }})
  },
  data() {
    return {
      permission: {
        add: 'alipayConfigController#insert',
        edit: 'alipayConfigController#update',
        del: 'alipayConfigController#deleteById',
      },
      dictionarys: [],
      rules: {
        appId: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.appId') }), trigger: 'blur' }],
        charset: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.charset') }), trigger: 'blur' }],
        format: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.format') }), trigger: 'blur' }],
        gatewayUrl: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.gatewayUrl') }), trigger: 'blur' }],
        notifyUrl: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.notifyUrl') }), trigger: 'blur' }],
        privateKey: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.privateKey') }), trigger: 'blur' }],
        publicKey: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.publicKey') }), trigger: 'blur' }],
        returnUrl: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.returnUrl') }), trigger: 'blur' }],
        signType: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.signType') }), trigger: 'blur' }],
        sysServiceProviderId: [{ required: true, message: i18n.t('input.required', { t: i18n.t(i18nQry.module + '.sysServiceProviderId') }), trigger: 'blur' }],
      },
    }
  },
  created() {
    this.moduleI18nInit(i18nQry)
    this.crud.optShow = { add: true, edit: true, preview: true, del: false, download: false, reset: true }
  },
  methods: {
    [CRUD.HOOK.beforeRefresh]() {
      return true
    },
  },
}
</script>

<style scoped></style>
